@import 'mixins';
@import 'vars';

.field {
    &-required {
        color: $color-theme-error;
    }

    &-disabled {
        color: $color-text-decent;
        font-size: $font-smallest;
        font-weight: normal;
    }

    &.expanded {
        @include absolute(0, 0, 0, 0);
        background-color: $color-white;
        border: 0;
        border-radius: 0;
        overflow-x: hidden;
        overflow-y: auto;
        padding: .75rem 1.25rem;
        padding-top: 1.5rem;
        z-index: 500;
    }
}

.buttons {
    & {
        @include absolute(100%, 0);
        margin: 0;
        margin-top: -9px;
    }

    &-container {
        position: relative;
    }

    .btn-clear {
        i {
            font-size: $font-smallest;
        }
    }
}

.ui {
    margin-bottom: 1rem;

    &-separator {
        border-bottom: 1px solid darken($color-border, 5%);
        color: lighten($color-text, 20%);
        font-size: 1.3rem;
        font-weight: normal;
        margin-bottom: 0;
        margin-top: 1.5rem;
        padding: .25rem 0;
    }
}